<template>
	<div class="add-filiale">
		<el-form :model="addForm" :rules="addFormRules" ref="addForm" label-width="100px">
			<el-form-item label="子公司名字:" prop="name">
				<el-input v-model="addForm.name" placeholder="请输入子公司名字" clearable></el-input>
			</el-form-item>
			<el-form-item label="子公司地址:" prop="address">
				<el-input v-model="addForm.address" placeholder="请输入子公司地址" clearable></el-input>
			</el-form-item>
		</el-form>
		<div class="btn-group">
			<el-button @click="cancel()">取 消</el-button>
			<el-button type="primary" @click="addFabricClick('addForm')">确 定</el-button>
		</div>
	</div>
</template>

<script>
	export default {
		props: {
			layerid: {
				type: String,
				default: ''
			},
			type: {
				type: Number,
				default: 0
			},
			info: Object
		},
		components: {

		},
		data() {
			return {
				addForm: {
					name: '',
					address: ''
				},
				addFormRules: {
					name: [{
						required: true,
						message: '请输入子公司名字'
					}],
					address: [{
						required: true,
						message: '请输入子公司地址'
					}]
				}
			};
		},
		methods: {
			init() {
				if (this.type == 1) {
					this.addForm.filiale_id = this.info.filiale_id
					this.addForm.name = this.info.name
					this.addForm.address = this.info.address
					console.log(this.addForm)
				}
			},
			addFabricClick(formName) {
				this.$refs[formName].validate(valid => {
					if (valid) {
						if (this.type == 0) {
							this.$http(this.$ApiList.filialeAdd, this.addForm).then(res => {
								this.$layer.msg(res.datas);
								this.$parent.init();
								this.cancel();
							});
						} else {
							this.$http(this.$ApiList.filialeUp, this.addForm).then(res => {
								this.$layer.msg(res.datas);
								this.$parent.init();
								this.cancel();
							});
						}
					} else {
						this.$layer.msg('请填写完整信息后提交');
					}
				});
			},

			cancel() {
				this.$layer.close(this.layerid);
			}
		},
		created() {
			this.init();
		}
	};
</script>
<style lang="scss">
	.add-filiale {
		padding: 20px 20px;
		margin: 0 auto;

		.btn-group {
			display: flex;
			justify-content: center;
			align-items: center;
			padding-bottom: 20px;
		}
	}
</style>
